import React from 'react'

const Login = () => {
  const [business, SetBusiness] = React.useState({
    mobile: '18888888866',
    password: '123123'
  })

  // 提交表单的方法
  const login = async (values: any) => {
    var result = await React.HTTP.post('/business/login', values)

    if (result.code == 0) {
      React.error(result.msg, () => { })
      return false
    }

    React.success(result.msg, () => {
      // 保存用户信息
      React.Cookie.save('business', result.data)

      // 跳转
      // React.navigate(result.url)

      // 刷新跳转
      window.location.href = result.url
    })
  }

  return (
    <div className="login">
      <link rel="stylesheet" href="/assets/css/login.css" />

      <React.UI.Form
        layout='vertical'
        mode='card'
        initialValues={business}
        onFinish={login}
        footer={
          <React.UI.Button block type='submit' color='primary' size='large'>登录</React.UI.Button>
        }
      >
        <React.UI.Form.Item
          name="mobile"
          label="手机号码"
          rules={[
            { required: true, message: '手机号码不能为空' },
            { pattern: /^1[3456789]\d{9}$/, message: '手机号码格式不正确' }
          ]}
        >
          <React.UI.Input placeholder="请输入手机号码" />
        </React.UI.Form.Item>

        <React.UI.Form.Item
          name="password"
          label="密码"
          rules={[{ required: true, message: '密码不能为空' }]}
        >
          <React.UI.Input type="password" placeholder="请输入密码" />
        </React.UI.Form.Item>

        <div className="tips">
          <div>忘记密码</div>
          <div>注册账号</div>
        </div>
      </React.UI.Form>
    </div >
  )
}

export default Login
